<template>
  <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">

    <div class="panel panel-default"
         v-for="i in intrs"
         :key="intrs.indexOf(i)">
      <div class="panel-heading" role="tab" :id="'heading'+intrs.indexOf(i)">
        <h4 class="panel-title">
          <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion"
             :href="'#collapse'+intrs.indexOf(i)"
             aria-expanded="false" :aria-controls="'collapse'+intrs.indexOf(i)">
            {{i.ti}}
          </a>
        </h4>
      </div>
      <div :id="'collapse'+intrs.indexOf(i)" class="panel-collapse collapse" role="tabpanel"
           :aria-labelledby="'heading'+intrs.indexOf(i)">
        <div class="panel-body">
          {{i.txt}}
        </div>
      </div>
    </div>
  </div>
</template>

<script>
  import {introductions} from '../request/req'

  export default {
    name: "introduction",
    data() {
      return {
        intrs: '',
        jjid: 3684
      }
    },
    mounted() {
      introductions(this.jjid).then(res => {
        this.intrs = res.data.introduction
        // console.log(res.data)
      });
    }
  }
</script>

<style scoped>

</style>
